<template>
	<view class="zh-u-mask">
		<view class="content" :class="{'active': props.show}" @click="handleClick" @touchmove.stop.prevent="movestop"></view>
	</view>
</template>

<script setup lang="ts">
	const props = defineProps<{
		show?: boolean
	}>()
	const emit = defineEmits(['click'])
	
	const handleClick = () => {
		emit('click')
	}
	
	const movestop = () => {
		
	}
</script>

<style lang="scss" scoped>
	.zh-u-mask {
		.content {
			position:fixed;
			top:0;
			left:0;
			right:0;
			bottom:0;
			background-color: #2D2E30;
			z-index:-999;
			height:0;
			opacity: 0;
			&.active {
				z-index:1;
				opacity: 0.6;
				height:100%;
				transition: opacity .15s ease-out;
			}
		}
	}
</style>